<template>
	<view style="width:100%">
		<form>
			<span>
				<view class="conwrap list">
					<view class="cu-form-group">
						<view class="title text-grey"><text class="text-grey">Real name</text></view>
						<input v-model="form.consignee" type="text" placeholder="please enter" />
					</view>
					<view class="cu-form-group">
						<view class="title text-grey"><text class="text-grey">Account number</text></view>
						<input v-model="form.card" type="text" placeholder="please enter" />
					</view>
					<view class="cu-form-group">
						<view class="title text-grey"><text class="text-grey">Bankname</text></view>
						<input v-model="form.affiliated" type="text" placeholder="please enter" />
					</view>
					<view class="cu-form-group">
						<view class="title text-grey"><text class="text-grey">IFSC</text></view>
						<input v-model="form.bank" type="text" placeholder="please enter" />
					</view>
					<view class="cu-form-group">
						<view class="title text-grey"><text class="text-grey">Mobile</text></view>
						<input v-model="form.mobile" type="text" placeholder="please enter" />
					</view>
				</view>
				<view class="padding flex flex-direction"><button class="cu-btn bg-blue round lg" @click="handleSave">Save</button></view>
				<Tips />
			</span>
		</form>
	</view>
</template>

<script>
import Tips from '../components/Tips.vue';
import fetch from '@/common/fetch.js';
import common from '@/mixin/common.js';
export default {
	components: {
		Tips
	},
	mixins: [common],
	data: () => ({
		form: {
			consignee: '',
			card: '',
			affiliated: '',
			bank: '',
			mobile: ''
		},
		info: {
			consignee: 'please enter',
			card: 'please enter',
			affiliated: 'please enter',
			bank: 'please enter',
			mobile: 'please enter'
		}
	}),
	methods: {
		handleSave() {
			if (this.vaild(this.form, this.info)) {
				fetch.request('/index/ucenter/saveBankCardsData',{
					bankName: this.form.affiliated,
					branch: this.form.bank,
					card_no: this.form.card,
					memberName: this.form.consignee,
					bank_mobile: this.form.mobile
				}, 'POST').then(res => {
					if (res.code === 0 || res.code === '-0') {
						uni.showToast({
							title: 'success',
							icon: 'none',
							duration: 2000
						});
						setTimeout(() => {
							uni.navigateTo({
								url: '/pages/withdraw/index'
							});
						}, 2100);
					}
				});
			}
			console.log('处理');
		}
	}
};
</script>

<style lang="less" scoped>
.container {
	width: 100%;
}
.conwrap {
	margin: 9px;
	background: #fff;
	border-radius: 5px;
	box-sizing: border-box;
	padding: 9px;
}
.list .cu-form-group {
	padding-left: 4px;
}
.list .cu-form-group .title {
	min-width: calc(4em + 15px);
}
.cu-form-group + .cu-form-group {
	border-top: 1px solid #eee;
}
.bg-blue {
	background-color: #F53D46;
}
.cu-form-group uni-input, .cu-form-group wx-input {
    color: #000;
}
</style>
